<%@ page language="java" contentType="text/html; charset=UTF-8"
         pageEncoding="UTF-8"%>
<%@taglib prefix="mvc" uri="http://www.springframework.org/tags/form" %>
<%@taglib prefix="fmt" uri="http://www.springframework.org/tags" %>
<%
    String path = request.getContextPath();
    String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
%>
<!DOCTYPE html>
<html>
<head lang="en">
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <title>新增申请</title>
    <link rel="stylesheet" href="/lib/layui/layui/css/layui.css">
    <link rel="stylesheet" href="/lib/layui/layui/css/common.css">
    <script src="/lib/layui/layui/layui.js"></script>
    <script type="text/javascript" src="../../js/jquery/jquery-1.9.1.js"></script>
    <script src="../../js/base/base.js" type="text/javascript" charset="utf-8"></script>
    <script type="text/javascript" src="/lib/layui/layui/global.js"></script>
    <script src="/lib/layui/layui/js/common.js?v=20190726" type="text/javascript" charset="utf-8"></script>
    <style>
        *{
            margin: 0;
            padding: 0;
        }
        .layui-card-header{
            border-bottom: 1px solid #eee;
        }
        .newTable{
            width: 80%;
            margin: 0 auto;
        }
        .layui-form .one{
            width: 100%;
            display: flex;
            flex-flow: row wrap;
            justify-content: space-around;
        }
        .layui-form-item{
            width: 48%;
        }
        .layui-inline{
            width: 40%;
            height: 38px;
        }
        .layui-form-label{
            width:64px;
        }
        .layui-input-block{
            margin-left: 140px;
            width: 240px;
        }
        select{
            width: 100%;
            height: 38px;
        }
        input::-webkit-input-placeholder {
            color: #aab2bd;
        }
        .buttonbottom{
            text-align: center;
        }
        .buttonbottom button{
            background-color: #009284;
            width: 90px;
            margin-top: 30px;
        }
        .layui-treeSelect .ztree li span.button.root_open:before, .layui-treeSelect .ztree li span.button.root_close:before{
            content: "\e623";
        }
        .layui-form-label{
            width: 100px;
        }
        .layui-table{
            width:100%!important;
        }
    </style>
</head>
<body>
<div class="mbox">
    <div class="layui-card">
        <div class="layui-card-body">
            <form class="layui-form" lay-filter="formTest" action=""style="width: 100%;margin: 0 auto;">
                <div style="width: 100%;height:36px;line-height:36px;font-weight:bold;padding-left: 6px;background-color: #eeeeee">报废信息</div>
                <div class="one" style="padding-top: 20px;">
                    <div class="layui-form-item">
                        <label class="layui-form-label" style="width: 100px;"><span style="color: red;">*</span>报废申请部门</label>
                        <div class="layui-input-block" style="width: 240px;" id="deptoper">
                            <select name="deptName" style="" id="deptName" lay-filter="selectdept" >
                                <option></option>
                            </select>
                        </div>
                    </div>
                    <div class="layui-form-item">
                        <label class="layui-form-label" style="width: 100px;"><span style="color: red;">*</span>报废申请人</label>
                        <div class="layui-input-block" style="width: 240px;">
                            <input type="text" id="applicant" name="applicant" lay-verify="required" placeholder="请输入" autocomplete="off" class="layui-input">
                        </div>
                    </div>
                </div>
                <div class="one">
                    <div class="layui-form-item">
                        <label class="layui-form-label"><span style="color: red;">*</span>报废申请日期</label>
                        <div class="layui-input-block">
                            <input type="text" name="applicantTime" id="applicantTime" lay-verify="required" autocomplete="off" class="layui-input"  placeholder="yyyy-MM-dd" >
                        </div>
                    </div>
                    <div class="layui-form-item">
                        <label class="layui-form-label"><span style="color: red;">*</span>报废原因</label>
                        <div class="layui-input-block">
                            <input type="text" name="scrapReason" id="scrapReason" lay-verify="required" autocomplete="off" class="layui-input"  placeholder="请输入" >
                        </div>
                    </div>
                </div>
                <div class="one">
                    <div class="layui-form-item layui-form-text">
                        <label class="layui-form-label">备注</label>
                        <div class="layui-input-block">
                            <input type="text" name="memo" id="memo" placeholder="请输入" autocomplete="off" class="layui-input">
                        </div>
                    </div>
                    <div class="layui-form-item layui-form-text">
                        <label class="layui-form-label"></label>
                        <div class="layui-input-block">
                            <input  disabled style="border: none;" type="text" name="memo" id="" placeholder="" autocomplete="off" class="layui-input">
                        </div>
                    </div>
                </div>
                <div id="eqba" style="width: 100%;height:36px;line-height:36px;font-weight:bold;padding-left: 6px;background-color: #eeeeee">设备信息</div>
                <table id="Settlement" lay-filter="SettlementFilter"></table>
            </form>
        </div>
    </div>
</div>
<script type="text/html" id="toolbar">
    <div class="layui-btn-container">
        <button type="button" class="layui-btn layui-btn-sm" lay-event="add" id="add" style="width: 70px">选择设备</button>
        <button type="button" class="layui-btn layui-btn-sm" lay-event="del" style="width: 70px">删除</button>
    </div>
</script>
<script>
    // 获取地址栏参数值
    function getQueryString(name){
        var reg = new RegExp("(^|&)"+ name +"=([^&]*)(&|$)");
        var r = window.location.search.substr(1).match(reg);
        if(r!=null)return  unescape(r[2]); return null;
    }
    var begin = getQueryString("begin");
    var ownerlogId = getQueryString("ownerlogId");
    var SettlementTable;
    var eqdata;
    var userName;
    layui.use(['form','table', 'laydate','element'], function() {
        var form = layui.form
            , layer = layui.layer
            , laydate = layui.laydate
            , table = layui.table
            , $ = layui.jquery;
        if(begin == "add") {
            //报废部门下拉框
            $.ajax({
                type: 'get',
                url: '/equipmentScrapping/showUserAndDept',
                dataType: 'json',
                success: function (data) {
                    var render = [];
                    var t = data.data[1];
                    var userName = data.data[0].userName;
                    var userId = data.data[0].userId;
                    for (var i = 0; i < t.length; i++) {
                        render.push("<option class='' value=\"" + t[i].deptId + "\">" + t[i].deptName + "</option>");
                    }
                    $("#deptName").html(render.join(""));
                    form.render();
                    $("#applicant").val(userName);
                    $("#applicant").attr("data-id", userId);
                    $("#applicant").attr("disabled", true);
                }
            });
            // 表格实例
            SettlementTable = table.render({
                elem: '#Settlement'
                , data: []
                , page: { //支持传入 laypage 组件的所有参数（某些参数除外，如：jump/elem） - 详见文档
                    layout: ['prev', 'page', 'next', 'skip', 'count', 'limit',]//自定义分页布局
                    , limits: [5, 10, 15, 20, 25, 30, 35, 40, 45, 50]
                    , first: false //不显示首页
                    , last: false //不显示尾页
                } //开启分页
                , toolbar: '#toolbar'
                , cols: [[ //表头
                      {type: 'checkbox',LAY_CHECKED:true }
                    , {field: 'equipNo', title: '固定资产编码'}
                    , {field: 'equipName', title: '设备名称'}
                    , {field: 'equipTypeName', title: '设备类型'}
                    , {field: 'deptName', title: '所属部门'}
                    , {field: 'equipStatuasName', title: '资产状态'}
                    , {field: 'modelNo', title: '型号'}
                    , {field: 'spec', title: '规格'}
                ]]
                , limit: 5
                , done: function (res) {
                    if(res.data.length==0){
                        $('.layui-form-checkbox').removeClass('layui-form-checked')
                    }
                }
            });
            // 表格头事件
            table.on('toolbar(SettlementFilter)', function (obj) {
                var layEvent = obj.event;
                var deptid = $("#deptoper").find("dl dd.layui-this").attr("lay-value");
                switch (layEvent) {
                    case 'add':
                        layer.open({
                            type: 2,
                            skin: false, //加上边框
                            area: ['960px', '98%'], //宽高
                            title: '选择设备',
                            btn: ['确定', '取消'],
                            btnAlign: 'c',
                            content: '/equipmentScrapping/addEquipmentg?deptId=' + deptid
                            , success: function (res) {

                            },
                            yes: function (index, layero) {
                                eqdata = $(layero).find("iframe")[0].contentWindow.getData();
                                var aarr = layui.table.cache["Settlement"];
                                if (eqdata.length == 0) {
                                    layer.msg("请选择设备添加到下方表格并选中添加的设备再点击确定！");
                                    return false;
                                } else {
                                    layer.close(index);
                                    for (var i = 0; i < eqdata.length; i++) {
                                        aarr.push(eqdata[i]);
                                    }
                                    // 数组对象去重
                                    var result = [];
                                    var obj = {};
                                    for (var i = 0; i < aarr.length; i++) {
                                        if (!obj[aarr[i].equipId]) {
                                            result.push(aarr[i]);
                                            obj[aarr[i].equipId] = true;
                                        }
                                    }
                                    SettlementTable.reload({
                                        data: result
                                    })
                                }
                            }
                        });
                        break;
                    case 'del':
                        var ar = layui.table.cache["Settlement"];
                        var checkStatus = table.checkStatus('Settlement').data;
                        for (var i = 0; i < checkStatus.length; i++) {
                            deleteItem(checkStatus[i].equipId, ar);
                        }
                        if (checkStatus == undefined || checkStatus.length <= 0) {
                            layer.msg("请选中一条或者多条数据进行删除");
                        }
                        if (checkStatus != undefined && checkStatus.length > 0) {
                            SettlementTable.reload({
                                data: ar
                            });
                            layer.msg("删除成功");
                        }
                        break;
                }
            });
        }
        if(begin == "edit"){
            $("#eqba").css("display","none");
            var objdata = parent.eddata;
            form.val("formTest",objdata);
            //报废部门下拉框
            $.ajax({
                type: 'get',
                url: '/equipmentScrapping/showUserAndDept',
                dataType: 'json',
                success: function (data) {
                    var render = [];
                    var t = data.data[1];
                    var userName = data.data[0].userName;
                    var userId = data.data[0].userId;
                    for (var i = 0; i < t.length; i++) {
                        render.push("<option class='' value=\"" + t[i].deptId + "\">" + t[i].deptName + "</option>");
                    }
                    $("#deptName").html(render.join(""));
                    $('#deptName').find('option[value="'+objdata.deptId+'"]').prop('selected',true);
                    form.render();
                }
            });
            $("#applicant").val(objdata.applicant);
            $("#applicant").attr("disabled", true);
            $("#memo").val(objdata.memo);
            $("#scrapReason").val(objdata.scrapReason);
            $("#applicantTime").val(format(objdata.applicantTime));
        }
        // 日期选择--报废日期
        laydate.render({
            elem:'#applicantTime'
            ,trigger: 'click'//呼出事件改成click
            ,format: 'yyyy-MM-dd'
        });
    });
    //将毫秒数转为yyyy-MM-dd格式时间
    function format(t) {
        if(t) return new Date(t).Format("yyyy-MM-dd");
        else return ''
    }
    // 数组对象的删除
    function deleteItem (item, list) {
        // 先遍历list里面的每一个元素，对比item与每个元素的id是否相等，再利用splice的方法删除
        for (var key in list) {
            if (list[key].equipId === item) {
                list.splice(key, 1)
            }
        }
    };
    function addData() {
        var jsonlist = {};
        jsonlist.deptName = $("#deptoper").find("dl dd.layui-this").text();
        jsonlist.deptId = $("#deptoper").find("dl dd.layui-this").attr("lay-value");
        jsonlist.applicant = $("#applicant").attr("data-id");
        jsonlist.applicant = $("#applicant").val();
        jsonlist.memo = $("#memo").val();
        jsonlist.applicantTime = $("#applicantTime").val();
        jsonlist.scrapReason = $("#scrapReason").val();
        return jsonlist;
    }
    function addjData() {
        var jsondata = layui.table.cache['Settlement'];
        return jsondata;
    }
</script>
</body>
</html>
